<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%request.setCharacterEncoding("utf-8"); %>
<%@page import="com.mall.model.Commodity"%>
<!DOCTYPE HTML>
<html>
<head>
<title>俊宁电器网上商城</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="keywords" content="俊宁电器,俊宁电器网上商城">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/bootstrap.min.css" />
<link href="${pageContext.request.contextPath}/css/font-awesome.min.css"
	rel="stylesheet" type="text/css">

</head>
<script src="${pageContext.request.contextPath}/js/jquery-1.6.3.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/css/unslider.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e){
    $('#b02').unslider({
    	dots: true
    });
});
$(function(){
   $("#sort").mouseover(function(){

    	$("#sortul").css("display","block");
    });
    $("#sort").mouseleave(function(){
    	$("#sortul").css("display","none");
    });
 $("#screendiv").mouseover(function(){

    	$("#screen").css("display","block");
    });
    $("#screendiv").mouseleave(function(){
    	$("#screen").css("display","none");
    });
$("#pagea").click(function(){
		var pageNum=$("#pageNum").html();
		if(pageNum==1){
		return false;
		}
		
});

});
</script>
<body style="width:1366px">
	<c:if test="${user==null}">
		<div class="container"
			style="width:100%;padding-top:5px;margin: auto; border-bottom: 1px solid #D9D9D9;background:#EDEDED">
			<div class="row">
				<div style="display:inline-block;margin:0 0 0 300px">
					欢迎您,<a href="${pageContext.request.contextPath}/login.jsp"> <span
						style="color:#FF7256">请登录!</span>
					</a>
				</div>
				<div style="display:inline-block;margin-left:420px">
					<a href="${pageContext.request.contextPath}" style="color: #FF7256">首页<span
						class="fa fa-home"> </span></a>
				</div>
				<div style="display: inline-block;margin-left:100px">
					<a href="${pageContext.request.contextPath}/register.jsp"
						style="color: #FF7256">注册账号 <span class="fa fa-file-text-o"></span>
					</a>
				</div>
				<div style="display:inline-block;">
					<a href="tencent://message/?uin=3091482148&Site=&Menu=yes"
						style="color: #FF7256;margin-left:100px">联系我们 <span
						class="fa fa-envelope-o"></span>
					</a>
				</div>
			</div>
		</div>
	</c:if>
	<c:if test="${user!=null }">
		<div class="container"
			style="width:100%;padding-top:5px;margin: auto; border-bottom: 1px solid #D1D1D1;background: #EDEDED">
			<div class="row">
				<div class="col-md-2 col-md-offset-2">
					欢迎您,<a href="#"> <span style="color:#FF7256">${user.name }</span>
					</a>
				</div>
				<div class="col-md-1 col-md-offset-3">
					<a href="${pageContext.request.contextPath}" style="color: #FF7256">首页<span
						class="fa fa-home"> </span></a>
				</div>
				<div class="col-md-2" style="padding-left: 50px">
					<a href="${pageContext.request.contextPath}/user/center.action"
						style="color: #FF7256">个人中心 <span class="fa fa-cog"
						style="color:#FF7F00"></span>
					</a>
				</div>
				<div class="col-md-2">
					<a href="${pageContext.request.contextPath}/user/outLogin.action"
						style="color: #FF7256">退出登录 <span class="fa fa-power-off"></span>
					</a>
				</div>
			</div>
		</div>
	</c:if>
	<div>
		<img src="${pageContext.request.contextPath}/img/juninglogo.jpg"
			class="img-responsive"
			style="display:inline-block;width: 200px;height: 200px;margin-left:15%">
		<form method="post"
			action="${pageContext.request.contextPath}/commodity/search.action"
			style="display:inline-block;width: 50%;">
			<div style="background: #FF7F00;margin-left: 4%;width: 100%">
				<input type="text" name=keyword
					style="height: 7%;border:2px solid #FF7256;width:88%;font-size: 125%;color: #7A378B;"
					placeholder="搜索'电冰箱','微波炉',等等..." /> <input type="hidden"
					value="sold desc,price asc" name="sort" /> <input type="submit"
					value="搜索商品"
					style="border:0px;height: 7%;width:10%;color:#fff;background:#FF7F00;" />
			</div>
		</form>
	</div>
	<div>
		<div class="banner" id="b02">

			<ul>

				<li><a href=""><img
						src="${pageContext.request.contextPath}/img/Ad1.png" width="80%"
						height="280px"></a></li>

				<li><a href=""><img
						src="${pageContext.request.contextPath}/img/Ad2.png" width="80%"
						height="280px"></a></li>

				<li><a href=""><img
						src="${pageContext.request.contextPath}/img/Ad3.png" width="80%"
						height="280px"></a></li>

				<li><a href=""><img
						src="${pageContext.request.contextPath}/img/Ad4.png" width="80%"
						height="280px"></a></li>

				<li><a href=""><img
						src="${pageContext.request.contextPath}/img/Ad5.png" width="80%"
						height="280px"></a></li>

			</ul>
		</div>
	</div>
	<div>
		<div style="float: left;width: 14%">

			<ul style="list-style:none;" id="mainul">
				<div style="background:#FF7256;border: 1px solid #fff">
					<a href="${pageContext.request.contextPath}"><li>热销电器</li></a> <a
						href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=冰箱"><li>冰箱</li></a>
					<a
						href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=空调"><li>空调</li></a>
					<a
						href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=电视机"><li>电视机</li></a>
					<a
						href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=洗衣机"><li>洗衣机</li></a>
					<a
						href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=家庭影音"><li>家庭影音</li></a>
					<a
						href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=厨房用品"><li>厨房用品</li></a>
				</div>
			</ul>

		</div>
		<iframe
			src="${pageContext.request.contextPath}/SeckillController/redisToView.action"
			id="iframe" name="iframe" scrolling="no"
			style="width:185px;height:660px;position: absolute;
		left:1180px;top:570px;border:1px solid red;text-align: center;">
		</iframe>
		<div style="width: 86%;float: left;">
			<div class="row" id="row2">
				<div class="col-md-3 col-md-offset-1">
					<div id="sort">
						<span style="font-size: 15px; cursor: pointer;color:#fff">排序方式&nbsp;<i
							class="fa fa-angle-double-right"></i></span>
						<ul style="" class="sort" id="sortul">
							<c:if test="${categoryid==null }">
								<li><a
									href="${pageContext.request.contextPath}/commodity/index.action?type=price asc">价格由低到高</a></li>
								<li><a
									href="${pageContext.request.contextPath}/commodity/index.action?type=price desc">价格由高到低</a></li>
								<li><a
									href="${pageContext.request.contextPath}/commodity/index.action?type=udate desc">上架时间</a></li>
								<li><a
									href="${pageContext.request.contextPath}/commodity/index.action?type=sold desc">销量</a></li>
							</c:if>
							<c:if test="${categoryid!=null }">
								<li><a
									href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=${categoryid}&type=price asc">价格由低到高</a></li>
								<li><a
									href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=${categoryid}&type=price desc">价格由高到低</a></li>
								<li><a
									href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=${categoryid}&type=udate desc">上架时间</a></li>
								<li><a
									href="${pageContext.request.contextPath}/commodity/searchCommIndex.action?categoryid=${categoryid}&type=sold desc">销量</a></li>
							</c:if>
						</ul>
					</div>
				</div>
				<div class="col-md-2 col-md-offset-1">
					<div id="screendiv">
						<span style="cursor: pointer;color:#fff">筛选</span>
						<div id="screen">
							<form id="formspan" method="post"
								action="${pageContext.request.contextPath}/commodity/screen.action"
								style="border:1px solid #999;width: 200px;background: #FFF5EE">
								<span style="font-size:15px;font-weight: 800">品牌筛选</span><br>
								<span>美的</span> <input type="checkbox" value="美的" name="meidi">&nbsp;&nbsp;
								<span>格力</span> <input type="checkbox" value="格力" name="geli">&nbsp;&nbsp;
								<span>长虹</span> <input type="checkbox" value="长虹"
									name="changhong">&nbsp;&nbsp; <br>
								<span>海尔</span> <input type="checkbox" value="海尔" name="haier">&nbsp;&nbsp;
								<span>西门子</span> <input type="checkbox" value="西门子"
									name="ximenzi">&nbsp;&nbsp; <span>其他</span> <input
									type="checkbox" value="其他" name="qita">&nbsp;&nbsp; <br>
								<span style="font-size:15px;font-weight: 800">价格区间</span><br>
								<input type="text" style="width: 40px;height: 22px"
									name="sprice"> <span>元 </span> <span
									class="fa fa-angle-right"></span> <input type="text"
									style="width: 40px;height: 22px" name="eprice"> <span>元
								</span> <input type="hidden" value="${categoryid}" name="categoryid">
								<br>
								<input type="submit" value="确定" class="btn-default btn-xs"
									style="margin-left:80%;
							border:2px solid #CDC9C9;border-radius:3px">
							</form>
						</div>
					</div>
				</div>
				<div class="col-md-2 col-md-offset-2">
					<a href="${pageContext.request.contextPath}"> <span>热销商品</span>
					</a>
				</div>
			</div>

		</div>
		<div style="width: 86%;float: left;">
			<div style="width: 90%;min-height: 365px;">
				<c:if test="${list!=null}">
					<c:forEach items="${list}" var="comm">
						<div class="mallwindow">
							<a
								href="${pageContext.request.contextPath}/commodity/getComm.action?id=${comm.id}"
								target="_blank"> <img
								src="${pageContext.request.contextPath}/file/img/${comm.titleimg}"
								width="221px" height="222px"> <span
								class=" fa fa-yen fa-2x" style="color:#FF7F00;margin-top:5px"></span>
								<span style="color:#FF7F00;font-size: 22px ">${comm.price }元</span>
								<br>
							<span style="color: #999">已售出:${comm.sold}件</span><br> <span
								style="margin-left: 10px;font-size: 15px;font-weight: 600;color: #000">
									${comm.title} </span>
							</a>
						</div>
					</c:forEach>
				</c:if>
			</div>
		</div>
		<c:if test="${list==null }">
			<h3 style="position:relative ;left:600px;top:-220px;z-index:99">抱歉!没有您要的商品.</h3>
		</c:if>
		<%-- <%
        	List<Commodity> comm=(List<Commodity>)request.getAttribute("list");
        	Integer page2=(Integer)request.getAttribute("page");
        	if(comm.size()==8||page2>0){
         %> --%>
		<div style="margin:20px 0 0 570px">
			<a id="upa"
				href="${pageContext.request.contextPath}/commodity/index.action?page=${page-1}"
				id="pagea">上一页</a> <span style="margin-left:30px ">当前第</span> <span
				style="color:#FF6347" id="pageNum">${page+1}</span>页 <a id="bta"
				href="${pageContext.request.contextPath}/commodity/index.action?page=${page+1}"
				style="margin-left:30px " id="pagea2">下一页</a>
		</div>
		<input type="hidden" id="type" value="${type }"> <input
			type="hidden" id="categoryid" value="${categoryid}"> <input
			type="hidden" id="map" value="${map}">
		<%--    <%} %> --%>
	</div>
	<div style="width:1100px;height:150px;margin-top:40px">
		<div
			style="margin:15px 0 0 540px;color:#595959;font-size:13px;font-weight:600;
			letter-spacing:3px">
			本站由DGW制作,版权归俊宁电器所属.</div>
		<div
			style="margin:15px 0 0 595px;color:#595959;font-size:13px;font-weight:600;
			letter-spacing:3px">
			蜀ICP备20170105号</div>
		<div
			style="margin:15px 0 0 576px;color:#595959;font-size:13px;font-weight:600;
			letter-spacing:3px">
			2017-7-1 —— 2017-9-21</div>
	</div>
</body>
<script type="text/javascript">
  $(document).ready(function(){
  		 	/* 翻页判断 */
	   	var upa=$("#upa");
	   	var bta=$("#bta");
   	var type=$("#type").val();
   	var categoryid=$("#categoryid").val();
   	var map=$("#map").val();
   			if(!(type==null||type=="")){
   	upa.attr("href","${pageContext.request.contextPath}/commodity/index.action?page=${page-1}&type="+type);
   	bta.attr("href","${pageContext.request.contextPath}/commodity/index.action?page=${page+1}&type="+type);
   			}
   			if(!(categoryid==null||categoryid=="")){
   	upa.attr("href","${pageContext.request.contextPath}/commodity/searchCommIndex.action?page=${page-1}&categoryid="+categoryid);
   	bta.attr("href","${pageContext.request.contextPath}/commodity/searchCommIndex.action?page=${page+1}&categoryid="+categoryid);
   				if(!(type==null||type=="")){
   	upa.attr("href","${pageContext.request.contextPath}/commodity/searchCommIndex.action?page=${page-1}&categoryid="+categoryid+"&type="+type);
   	bta.attr("href","${pageContext.request.contextPath}/commodity/searchCommIndex.action?page=${page+1}&categoryid="+categoryid+"&type="+type);
   			}
   			}
   			if(!(map==""||map==null)){
   	upa.attr("href",
   	"${pageContext.request.contextPath}/commodity/screen.action?page=${page-1}&meidi"+
   	"=${map.meidi}&haier=${map.haier}&changhong=${map.changhong}&geli=${map.geli}"+
   	"&ximenzi=${map.ximenzi}&qita=${map.qita}&sprice=${map.sprice}&eprice=${map.eprice}");
   	bta.attr("href",
   	"${pageContext.request.contextPath}/commodity/screen.action?page=${page+1}&meidi"+
   	"=${map.meidi}&haier=${map.haier}&changhong=${map.changhong}&geli=${map.geli}"+
   	"&ximenzi=${map.ximenzi}&qita=${map.qita}&sprice=${map.sprice}&eprice=${map.eprice}");
   			}
   			
   			
  });
   </script>
<style>
#formspan span {
	color: #EE7942;
}

#sortul a {
	color: #EE7942;
}

.mallwindow {
	float: left;
	width: 225px;
	height: 340px;
	margin-left: 20px;
	margin-top: 20px
}

.mallwindow:hover {
	border: 1px solid #EE7942;
}

#row2 {
	height: 40px;
	background: #FFA07A;
	width: 90%;
	margin: auto;
	float: left;
	padding: 1%;
	border-bottom: 1px solid #D9D9D9;
}

#screen {
	display: none;
	position: absolute;
	z-index: 2;
	top: -1px;
	left: -1px;
}

.sort {
	display: none;
	position: absolute;
	z-index: 2;
	top: -1px;
	left: -50px;
}

.sort span:hover {
	color: #A9A9A9;
}

.sort li a {
	float: none;
	line-height: 20px;
	font-size: 15px
}

.sort li {
	background: #FFF5EE;
	border: 1px solid #E8E8E8;
	height: 28px;
	text-align: center;
	width: 170px
}

.sort li:hover {
	background: #C7C7C7;
}

a:hover {
	text-decoration: none;
}

#mainul {
	border: 1px solid #fff;
	padding: 0px;
	width: 100%
}

#mainul li {
	font-size: 18px;;
	width: 100%;
	height: 8%;
	text-align: center;
	color: #fff;
	border-bottom: 1px solid #fff;
	padding-top: 6%;
}

#mainul li:hover {
	background: #FF0000;
}

.banner {
	position: relative;
	overflow: auto;
	text-align: center;
}

.banner ul li img {
	border: 1px solid #D9D9D9;
}

li {
	list-style: none;
}

.banner ul li {
	float: left;
}

#b02 .dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 20px;
}

#b02 .dots li {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 4px;
	text-indent: -999em;
	border: 2px solid #fff;
	border-radius: 6px;
	cursor: pointer;
	opacity: .4;
	-webkit-transition: background .5s, opacity .5s;
	-moz-transition: background .5s, opacity .5s;
	transition: background .5s, opacity .5s;
}

#b02 .dots li.active {
	background: #fff;
	opacity: 1;
}
</style>
</html>